﻿@model CodeStash.Models.Team.TeamModel
@{
	ViewBag.Title = "Team Settings";
	Layout = "~/Views/Shared/_Layout.cshtml";
}
@section SpecificPageHeadStuff
 {
	 @Html.CssTag(Url.Content("~/Content/Controllers/Team/team.css"))
	 @Html.ScriptTag(Url.Content("~/Scripts/Controllers/Team/team.js"))
}
@using CodeStash.ExtensionsMethods


<div id="dialog-message"  style="display:none;">
	<p id="dialog-message-content">
	</p>
</div>

<input type="hidden" id="CurrentDraggablePosition" />

<div id="TeamPanel">

	
	<h2>Setup Your Team Settings</h2>
	<p>You can use this page to create new teams and also assign your team mates to a team.</p>
	<p>Just follow the steps below</p>
	<div class="headedPanel">
		<div class="stepPanel">
			<br />
			<h4>
				Step 1 : Create New Team, Or Pick Existing Team</h4>
			<p>
				<strong>Create A New Team</strong>
				<br />
				@Html.TextBoxFor(x => x.TeamName)
                <input id="CreateTeam" type="button" value="Create Team" style="height:30px" />
                <br />
				<br />
				<strong>Existing Teams You Are Co-Ordinator Of</strong>
				<br />
				<select id="OwnedTeams" style="display: none" class="selectBox">
				</select>
			</p>
		</div>
	</div>
	<div id="AssignToTeamPanel"  class="headedPanel" style="display:none">
		<div class="stepPanel">
			<br />
			<h4>
				Step 2 : Pick Your Team Members, And Assign To Selected Team</h4>
			<p>
				<strong>Search For User To Add To Selected Team</strong>
				<br />
				@Html.TextBoxFor(x => x.Email)
                <input id="SearchForUsers" type="button" value="Search For Users" style="height:30px" />
                <br />
				<br />
                @Html.CheckBoxFor(m => m.IsOpenIdLogin, new { style = "float:left" })
                <label for="IsOpenIdLogin" class="centerAlignedText">Search For OpenId Registered Users</label>
				<br />
				<div id="FoundUsersPanel" style="display: none">
					<strong>Users That Matched Your Search</strong>
					<br />
					<select id="FoundUsers" class="selectBox">
					</select>
                    <input id="AssignUser" type="button" value="Assign User To Team" style="height:30px" />
                    <br />
				    <br />
				</div>
			</p>
		</div>
	</div>
	<div id="TeamMembersPanel" class="headedPanel" style="display:none">
		<div class="stepPanel">
			<br />
			<h4>Step 3 : Remove People From The Selected Team (If You Must)</h4>
			<br />

			<div id="teamMemberContainer"></div>


			<script id="teamMemberTemplate" type="text/x-jQuery-tmpl">
				<div class="ui-widget-content draggable">
					<input type="hidden" class="draggableHidden" value="${UserId}" />
					<span style="color:white">${UserName}</span>
					<img src="../../Content/images/people.png" class="TeamPeopleIcon" />
					<img src="../../Content/images/delete.png" class="TeamDeleteIcon" />
				</div>
				<div class="tooltip">
					You can drag ${UserName} to the bin to remove them from the current team
				</div>
			</script>
			


			<div class="ui-widget-header droppable">
			</div>

			


		</div>
	</div>


	


</div>


